<template>
  <div class="BaseLog">
    <!-- 按钮 -->
    <!-- {{param}} -->
    <div>
        <el-carousel :interval="2000" type="card" height="400px" >
          <el-carousel-item>
            <img src="./log1.jpg" class="carousel_image_type">
          </el-carousel-item>
          <el-carousel-item>
            <img src="./log1.jpg" class="carousel_image_type">
          </el-carousel-item>
          <el-carousel-item>
            <img src="./log1.jpg" class="carousel_image_type">
          </el-carousel-item>
          <el-carousel-item>
            <img src="./log1.jpg" class="carousel_image_type">
          </el-carousel-item>
          <el-carousel-item>
            <img src="./log1.jpg" class="carousel_image_type">
          </el-carousel-item>
          <el-carousel-item>
            <img src="./log1.jpg" class="carousel_image_type">
          </el-carousel-item>
          <el-carousel-item v-for="item in 0" :key="item">
          <h3 class="medium">{{ item }}</h3>
          </el-carousel-item>
        </el-carousel>
    </div>
    <div class="btns">
      <el-form size="small" inline style="text-align: center">
        <el-form-item label="真实姓名" label-width="80px">
          <el-input v-model="param.realname"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button  type="primary"  size="small"  icon="el-icon-search"  @click="loadBaseLog">查询</el-button>
        </el-form-item>
      </el-form>
      <div style="text-align:right">
        <el-button size="small" type="primary" icon="el-icon-download" @click="downloadHandler">导出</el-button>
        <el-button type="primary" size="small" icon="el-icon-circle-plus-outline" @click="toAddHandler">新增</el-button>
      </div>   
    </div>
    <!-- {{baseLog}} -->
    <!-- 表格 -->
    <el-table size="small" :data="BaseLog">
      <el-table-column type="index" :index="1" label="序号"></el-table-column>
      <el-table-column  label="真实姓名"  prop="realname"  align="center"></el-table-column>
      <el-table-column  label="方法"  prop="method"  align="center"></el-table-column>
      <el-table-column  label="内容"  prop="content"  align="center"></el-table-column>
      <el-table-column  label="写入时间"  prop="log_time"  align="center"></el-table-column>
      <el-table-column label="操作" width="200" align="center">
        <!-- 插槽 -->
          <template slot-scope="scope">
          <el-button type="primary" round  size="mini" icon="el-icon-edit" circle @click="editHandler(scope.row)">修改</el-button>
          <el-button type="danger" round size="mini" icon="el-icon-delete" circle @click="deleteHandler(scope.row)">删除</el-button>
          </template>
        <!-- /插槽 -->
      </el-table-column>
    </el-table>
    <!-- /表格 -->
    <!-- 滚动条 -->

    <!-- /滚动条 -->
<!-- 小星星 -->
    <div class="star" id="app">
    <el-rate
      v-model="value"
      show-text>
    </el-rate>
    </div>
<!--/小星星 -->

<!-- 回到顶部 -->
    <div class="foot" >
      <a href="#top" target="_self">返回顶部</a>
    </div>
<!-- /回到顶部 -->
  </div>  
</template>

<style>
.foot{
  height: 100%;
  width: 100%;
  background-color: #ffffff;
  box-shadow: 0 0 6px rgba(0,0,0, .12);
  text-align: center;
  line-height: 40px;
  padding-top: 5px;
  padding-left: 0%;
  font-size: 14px;
  color: #4400ff;
}

.foot p{
  color: #1900ff;
}
.test p{
  float: left;
  color: #fff;
  margin: 14px auto;
  padding-left: 20px;
  font-size: 16px;
}

.star{
  text-align: center;
  width: 100%;
  height: 50px;
  padding: 20px;
}
</style>

<script>
import { del, get, post } from "@/utils/request";
export default {
  // dateFormat(time) {
  //         var date=new Date(time);
  //         var year=date.getFullYear();
  //         /* 在日期格式中，月份是从0开始的，因此要加0
  //         * 使用三元表达式在小于10的前面加0，以达到格式统一  如 09:11:05
  //         * */
  //         var month= date.getMonth()+1<10 ? "0"+(date.getMonth()+1) : date.getMonth()+1;
  //         var day=date.getDate()<10 ? "0"+date.getDate() : date.getDate();
  //         var hours=date.getHours()<10 ? "0"+date.getHours() : date.getHours();
  //         var minutes=date.getMinutes()<10 ? "0"+date.getMinutes() : date.getMinutes();
  //         var seconds=date.getSeconds()<10 ? "0"+date.getSeconds() : date.getSeconds();
  //         // 拼接
  //         return year+"-"+month+"-"+day+" "+hours+":"+minutes+":"+seconds;
  //     },
  // 页面数据
  data() {
    return {
      //参数，
      param: {},

      //组件模板中需要的数据；
      BaseLog: [],

      date:new Date(),
    };
  },
  // 页面渲染的时候会调用的函数
  created() {
    this.loadBaseLog();
  },
  // 所有的方法
  methods: {
    //导出
      downloadHandler(){
        window.location.href="http://121.196.106.124:8888/baseLog/download?name="+this.param.realname
      },
    //修改事件的处理函数
    editHandler(row) {
      this.$router.push({
        path: "/BaseFile/BaseLog_create",
        query: row,
      });
    },
    //删除函数处理函数
    deleteHandler(row) {
      this.$confirm("此操作将永久删除该数据, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        let url = "http://121.196.106.124:8888/baseLog/deleteById";
        del(url, { id: row.id }).then((resp) => {
          this.$message({ type: "success", message: resp.message });
          this.loadBaseLog();
        });
      });
    },
    //跳转
    toAddHandler() {
      this.$router.push("/BaseFile/BaseLog_create");
    },
    loadBaseLog() {
      let url = "http://121.196.106.124:8888/baseLog/query";
      get(url, this.param).then((resp) => {
        this.BaseLog = resp.data;
      });
    },
  },
//  mounted() {
//           //显示当前日期时间
//           let _this = this// 声明一个变量指向Vue实例this，保证作用域一致
//           this.timer = setInterval(() => {
//            _this.date = new Date(); // 修改数据date
//            }, 1000)
//        },
//       beforeDestroy() {
//        if (this.timer) {
//         clearInterval(this.timer); // 在Vue实例销毁前，清除我们的定时器
//       }
// },
  
  
};


</script>

<style scoped>

